<template>
  <div class="home_tabbar">
    <template v-for="item in user" :key="item.url">
      <router-link :to="`/${item.url}`">
        <div class="home_tabbar_box">
          <div>{{ item.tips }}</div>
        </div>
      </router-link>
    </template>
  </div>
</template>

<script>
export default {
  name: "tabbar",
  props: {
    user: {
      required: true,
      type: Array,
      default() {
        return [];
      },
    },
  },
  data() {
    return {};
  },
  created() {},
};
</script>

<style lang="scss" scope>
.home {
  &_tabbar {
    padding: 10px 15px;
    text-align: center;
    width: 100%;
    display: flex;
    position: fixed;
    bottom: 0;
    left: 0;
    background-color: #ffffff;
    &_box {
      flex: 1;
    }
  }
}
</style>
